import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:yysk_app/model/blind_model/list_by_blindId_record_model.dart';
import 'package:yysk_app/model/user_prop_model/list_by_propId_history_model.dart';
import 'package:yysk_app/net/api/api_url.dart';
import 'package:yysk_app/net/http.dart';
import 'package:yysk_app/utils/colors.dart';
import 'package:yysk_app/utils/helper.dart';
import 'package:yysk_app/utils/js_tool.dart';
import 'package:yysk_app/widget/custom_app_bar2.dart';
import 'package:yysk_app/widget/image_asset_widget.dart';
import 'package:yysk_app/widget/lazy_network_image.dart';
import 'package:yysk_app/widget/refresh_and_scroll_widget.dart';

class OpenBlindRecordPage extends StatefulWidget {
  static const path = '/openBlindRecordPage';
  const OpenBlindRecordPage({super.key});
  @override
  State<StatefulWidget> createState() => _OpenBlindRecordPage();
}

class _OpenBlindRecordPage extends State<OpenBlindRecordPage> {
  final ScrollController scrollController = ScrollController();
  int pageNum = 1;
  int pageSize = 10;
  final list = RxList<ListByBlindIdRecordItem>([]);
  late String propName;

  @override
  void initState() {
    super.initState();
    scrollController.addListener(() {
      if (scrollController.position.pixels ==
          scrollController.position.maxScrollExtent) {
        _getRecordList(loadMore: true);
      }
    });
    _getRecordList();
  }

  @override
  void dispose() {
    super.dispose();
    scrollController.dispose();
  }

  _getRecordList({loadMore = false}) {
    if (loadMore) {
      pageNum++;
    } else {
      pageNum = 1;
    }

    try {
      http.netFetch<ListByBlindIdRecordModel>(
        ApiUrl.userBoxPageRecord,
        params: {'pageNum': pageNum, 'pageSize': 20},
        success: (result) {
          List<ListByBlindIdRecordItem> items = result.data?.list ?? [];
          if (loadMore && items.isEmpty) {
            pageNum--;
          }
          if (!loadMore) {
            list.clear();
          }
          setState(() {
            list.addAll(items);
          });
        },
      );
    } catch (e) {
      if (loadMore) {
        pageNum--;
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    double top = MediaQuery.of(context).padding.top;

    return Scaffold(
      body: Column(
        children: [
          Expanded(
            child: Stack(
              children: [
                SizedBox(
                  width: context.width,
                  child: ImageAssetWidget(
                    width: 375.px,
                    height: 240.px,
                    alignment: Alignment.topCenter,
                    imageUrl: 'static/images/blind_record_bg.png',
                  ),
                ),
                Container(
                  padding: EdgeInsets.fromLTRB(0, 21.px, 0, 0),
                  child: Column(
                    children: [
                      SizedBox(height: top),
                      CustomAppBar2(title: '开盒记录', context: context),
                      Expanded(
                        child: Container(
                          padding: EdgeInsets.fromLTRB(15, 10, 15, 0),
                          child: RefreshAndScrollWidget(
                            onRefresh: _handleRefresh,
                            scrollController: scrollController,
                            itemBuilder: (item, index) => _listItem(item),
                            itemCount: list.length,
                            items: list,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _listItem(item) {
    return Container(
      height: 138.px,
      padding: EdgeInsets.all(12.px),
      margin: EdgeInsets.only(bottom: 12.px),
      decoration: BoxDecoration(
        color: AppColors.backgroundColorLightGrey,
        borderRadius: BorderRadius.circular(8.px),
      ),
      child: Column(
        children: [
          Row(
            children: [
              LazyImage(
                imageUrl: '${item.boxImageUrl}',
                height: 50.px,
                width: 50.px,
                borderRadius: 4.px,
              ),
              hiSpace(width: 21.px),
              SizedBox(
                height: 50.px,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      '${item.boxName}',
                      style: TextStyle(
                        fontSize: 18.px,
                        color: AppColors.backgroundColorBlack,
                        fontFamily: 'CustomFont',
                      ),
                    ),
                    Text(
                      '开盒时间: ${item.createTime}',
                      style: TextStyle(
                        fontSize: 12.px,
                        color: AppColors.fontColorGrey,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
          hiSpace(height: 6.px),
          Divider(color: AppColors.borderE9, thickness: 1),
          Expanded(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                hiSpace(width: 12.px),
                Text('获得', style: TextStyle(fontSize: 12.px)),
                hiSpace(width: 7.px),
                LazyImage(
                  width: 27.px,
                  height: 27.px,
                  alignment: Alignment.topCenter,
                  imageUrl: '${item?.awardImgUrl}',
                  borderRadius: 4.px,
                ),
                hiSpace(width: 8.px),
                Text('${item.awardName}', style: TextStyle(fontSize: 12.px)),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Future<void> _handleRefresh() async {
    _getRecordList();
  }
}
